<app-load *ngIf="isLoading"></app-load>
<app-tip [type]="'error'"></app-tip>

<div class="login-container" style="height: 100%">
  <div class="login-logo flex">
    <img src="https://dlhz.oss-cn-beijing.aliyuncs.com/xey-upload/JzAeyhQm8f.png" alt="">
  </div>

  <!-- 手机号密码登录 -->
  <div class="login-form flex" *ngIf="isMobileLogin">

    <div style="width: 90%">
      <div class="form-list form-list-shoadow"
           style="border-top:1px solid #ebebeb;border-bottom:1px solid #ebebeb;width: 90%">
        <div class="form-item-left">
          <img src="../assets/images/user.png" class="login-icon-size" style="position: absolute;top:1.2em;">
          <span style="padding-left: 1.8em;">手机号</span>
        </div>
        <div class="form-item-right">
          <input type="mobile" maxlength="11" [(ngModel)]="mobilePwd.mobile" style="font-size: 1.5em">
        </div>
      </div>
    </div>
    <div style="width: 90%">
      <div class="form-list form-list-shoadow-b" style="border-bottom:1px solid #ebebeb;width: 90%">
        <div class="form-item-left">
          <img src="../assets/images/lock.png" class="login-icon-size" style="position: absolute;top:1.3em;">
          <span style="padding-left: 1.8em;">密&nbsp;&nbsp;&nbsp;码</span>
        </div>
        <div class="form-item-right">
          <input type="password" maxlength="16" [(ngModel)]="mobilePwd.login_pwd" autocomplete="off"
                 style="font-size: 1.5em">
        </div>
      </div>
    </div>
    <div style="width: 95%">
      <div style="width: 90%;padding: 3% 5%;margin-top: 2%">
        <div class="login-btn" (click)="onSubmitPwd()">登录</div>
      </div>
    </div>
    <div style="width: 100%">
      <div class="form-list" style="margin-top: .5em;">
        <!--<div class="form-item-left" style="width:130px;color:#999;">-->
        <!--&lt;!&ndash;<span style="font-size:1.2em;" (click)="changeLoginMode()"><i class="fa fa-mobile-phone" style="font-size: 1.2em"></i> 手机动态码登录</span>&ndash;&gt;-->
        <!--</div>-->
        <div class="form-item-right" style="text-align:right;color:#4cafe9;">
          <span [routerLink]="['/get-back-pwd']"><i class="fa fa-question-circle" style="font-size: 0.9em"></i> <span
            style="font-size:0.9em;">忘记密码</span></span>
        </div>
      </div>
    </div>


    <!--<div class="share" style="margin-top:1em;margin-bottom:2em;">-->
    <!--<div class="share-item" style="border-top:1px solid #ebebeb;height: 1px"></div>-->
    <!--<div style="color:#999;font-size:0.9em;width:100px;text-align:center;margin-top:-6px"> 其它登录方式 </div>-->
    <!--<div class="share-item" style="border-top:1px solid #ebebeb;height: 1px"></div>-->
    <!--</div>-->

    <!--<div class="share" style="margin-top:1em;margin-bottom:1em;">-->
    <!--<div class="share-item"><i class="fa fa-weixin" aria-hidden="true" style="color: #6fc06b;font-size: 2em;"></i></div>-->
    <!--<div class="share-item"><i class="fa fa-qq" aria-hidden="true" style="color: #45cffe;font-size: 2em;"></i></div>-->
    <!--</div>-->
  </div>

  <!-- 手机号验证码登录 -->
  <div class="login-form" *ngIf="!isMobileLogin">
    <div class="form-list form-list-shoadow" style="border-top:1px solid #ebebeb;border-bottom:1px solid #ebebeb;">
      <div class="form-item-left">
        <img src="../assets/images/user.png" class="login-icon-size" style="position: absolute;top:1.2em;">
        <span style="padding-left: 1.8em;">手机号</span>
      </div>
      <div class="form-item-right">
        <input type="text" maxlength="11" style="font-size: 1.5em">
      </div>
    </div>

    <div class="form-list form-list-shoadow-b" style="border-bottom:1px solid #ebebeb;">
      <div class="form-item-left">
        <img src="../assets/images/code.png" class="login-icon-size" style="position: absolute;top:1.3em;">
        <span style="padding-left: 1.8em;">动态码</span>
      </div>
      <div class="form-item-center">
        <input type="passowrd" maxlength="16" style="font-size: 1.5em">
      </div>
      <div class="form-item-right" style="width: 6em;text-align: right">
        <div>获取动态码</div>
      </div>
    </div>

    <div style="margin-top:2em;">
      <div class="login-btn" (click)="onSubmitCode()">登录</div>
    </div>

    <div class="form-list" style="margin-top: 1.5em;">
      <div class="form-item-left" style="width:130px;color:#4cafe9;">
        <span style="font-size:1em;" (click)="changeLoginMode()"><i class="fa fa-unlock-alt" style="font-size: 1em"></i> <span
          style="font-size: 1.2em;">手机密码登录</span></span>
      </div>
    </div>
  </div>
  <div class="bottom" style="height: 10%;width:100%;justify-content: flex-end;align-items: center">
    <div class="name-cn" style="height: 2em;line-height: 2em;color: #999;text-align: center">兰州东良恒州网络科技有限责任公司</div>
    <div class="name-en" style="height: 2em;line-height: 2em;color: #999;text-align: center">Helena Network Technology
      LLC.
    </div>
  </div>
</div>


